<x-inner class="au-inner au-column">
  <au-tool padding>
    <x-button>查询</x-button>
  </au-tool>
  <div class="au-table-form">
    <div class="au-table-left au-table-single">
      <x-table
        [columns]="columns"
        [data]="data"
        [rowHeight]="0"
        [bodyHeight]="100"
        [bodyColumnTpl]="{ name: nameTpl }"
        [adaptionHeight]="118"
        (activatedRowChange)="activatedRowChange($event)"
        virtualScroll
        loading
        hiddenBorder
        showEllipsis="false"
        showTotal="false"
        showHeader="false"
      >
      </x-table>
    </div>
    <div class="au-panel au-form-right">
      <app-design-detail [detail]="this.activatedRow"></app-design-detail>
    </div>
  </div>
</x-inner>

<ng-template #nameTpl let-column="$column" let-row="$row" let-index="$index">
  <div class="design-td">
    <x-avatar icon="fto-user"></x-avatar>
    <div class="design-td-inner">
      <span class="design-td-name">{{ row.name }}</span>
    </div>
  </div>
</ng-template>
